<template>
    <user-wrapper :avatar="avatar||defaultAvatar" >
       <div slot="title" class="textEllipsis name">{{ name||defaultName }}</div> 
       <div slot="info" class="fontGrey desc" v-if="member!==undefined">
            群成员{{member}} 非好友{{Math.max(member-friend,0)}}
        </div>
    </user-wrapper>
</template>
<script>
import userWrapper from '@/components/user-wrapper';

const defaultName = '群聊天'
export default {
    data(){
        return {defaultName}
    },
    components:{userWrapper},
    name:"group",
    props:{
        avatar:{
            type:String
        },
        name:{
            type:String,
            default:()=>defaultName 
        },
        member:{
            type:Number,
        },
        friend:{
            type:Number,
        }
    } //['avatar','name','member','friend']  
}
</script>
<style scoped>
.name {
    line-height: 20px;
    font-size: 14px;
}
.desc{
    font-size: 12px;
    margin-top: 5px;
    line-height: 14px
}
</style>